BEM

2018-02-06

What is BEM? BEM stands for Block, Element, Modifier which is a naming convention for classes in HTML and CSS.

BLOCK: parent items, describes purpose. What is it? It shouldn't influence environment.

ELEMENT: child items that can be placed inside and these use 2 underscores in the name, following block name.

MODIFIER: items that change style of block.

I've seen BEM come up a few times so I decided to go back through projects to incorporate BEM or atleast attempt to :D

It has defintely been odd. I'm used to having my own system, but to use somewhat of a standard that would allow me or someone else to pick up a foreign script and have an idea of what's going on is obviously helpful.


← go back